<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>产品集合</title>
    <link rel="stylesheet" type="text/css" href="$request.getContextPath()/resources/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="$request.getContextPath()/resources/bootstrap-table/css/bootstrap-table.min.css" >
    <style type="text/css">
        body,.container-fluid{
            padding: 0px;
            margin: 0px;
            width:99.5%;
            height:100%;
        }
        .container-fluid .content{
            padding: 0px;
            margin: 0px;
            width:100%;
            height:100%;
        }
        .container-fluid .content .bootstrap-table{
            padding: 0px;
            margin: 0px;
            width:100%;
            height:100%;
        }
    </style>
</head>
<body>
<div class="container-fluid">
    <div class="content">
        <input type="hidden" name="imageURL" value="$!url.zimg()">
        <table id="table"
               data-toggle="table"
               data-show-refresh="false"
               data-search="false"
               data-show-toggle="false"
               data-show-columns="false"
               data-show-export="false"
               data-id-field="id"
               data-show-export="false"
               data-pagination="true"
               data-query-params="queryParams"
               data-query-type="limit"
               data-show-footer="false"
               data-click-to-select="true"
               data-single-select="false"
               data-striped="true"
               data-method="get"
               data-url="$request.getContextPath()/official/product/productsPage"
               data-side-pagination="server"
               data-page-list="[10, 25, 50, 100, ALL]"
               data-show-pagination-switch="false"
               data-id-field="id"
               data-search-on-enter-key="false"
               data-pagination-v-align="bottom"
               data-show-pagination-switch="false">
            <thead>
            <tr>
                <!--<th data-checkbox="true" data-width="40px"></th>-->
                <th data-field="logo" data-valign="center" data-align="center" data-width="60px" data-formatter="productLogoImgFormatter">产品LOGO</th>
                <th data-field="id" data-visible="true">产品ID</th>
                <th data-field="title" data-valign="center" data-align="center" >产品标题</th>
                <th data-field="createTime" data-valign="center" data-align="center" >创建时间</th>
            </tr>
            </thead>
        </table>
    </div>
</div>
</body>
<script type="text/javascript" src="$request.getContextPath()/resources/jquery/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="$request.getContextPath()/resources/bootstrap/js/bootstrap.min.js"></script>

<script type="text/javascript" src="$request.getContextPath()/resources/bootstrap-table/js/bootstrap-table.min.js"></script>
<script type="text/javascript" src="$request.getContextPath()/resources/bootstrap-table/js/bootstrap-table-zh-CN.min.js"></script>
<script type="text/javascript">
    //表格查询参数
    function queryParams(params) {
        console.log(params);
        return {
            searchContent:"$!cid",
            beginIndex:params.offset,
            pageSize:params.limit
        };
    }
    //用户头像展示
    function productLogoImgFormatter(value, row, index){
        var imageURL=$("input[name='imageURL']").val()+"/"+row.logo;
        return "<img src='"+imageURL+"' name='"+row.logo+"'  width='100%' height='35px' style='margin:-8px;padding:-8px;' class='userHeader' onclick='productLogoClick(this.name)'/>";
    }
</script>
</html>